import React from "react";

const ConfigurationIcon = (props) => {
  return (
    <svg
      id="Layer_2"
      data-name="Layer 2"
      xmlns="http://www.w3.org/2000/svg"
      viewBox="0 0 64 64"
      width={props.width ? props.width : "24px"}
      height={props.height ? props.height : "24px"}
      fill={props.fill ? props.fill : "currentColor"}
      onClick={props.onClick}
      className={props.className}
      color={props.color ? props.color : "unset"}
      fontSize={props.fontSize ? props.fontSize : "unset"}
      style={{ ...props.style }}
    >
      <path d="M58.17,44.55a9.57,9.57,0,0,0-9.75-2.34L21.79,15.58c2.35-6.79-3.95-13.91-11-12.4a1,1,0,0,0-.79.88,1,1,0,0,0,.28.81l4,4L13.1,13.1,8.83,14.24l-4-4A1.1,1.1,0,0,0,4.06,10a1,1,0,0,0-.88.79c-1.55,7,5.7,13.41,12.42,11L42.21,48.42c-2.36,6.79,4,13.91,11,12.4a1,1,0,0,0,.79-.88,1,1,0,0,0-.28-.81l-4-4L50.9,50.9l4.27-1.14,4,4a1.29,1.29,0,0,0,.71.3h0a1,1,0,0,0,1-.81A9.59,9.59,0,0,0,58.17,44.55Z" />
      <path d="M39.28,29.52a1,1,0,0,0,1.41,0l7.46-7.45c9,2.57,15.59-8.52,9-15.21s-17.75,0-15.19,9l-7.47,7.47a1,1,0,0,0,0,1.41ZM45.84,14.1l1-3.88a1,1,0,0,1,.71-.71l3.88-1a1,1,0,0,1,1,.26l2.84,2.84a1,1,0,0,1,.26,1l-1,3.88a1,1,0,0,1-.71.71l-3.88,1a1.07,1.07,0,0,1-.25,0,1,1,0,0,1-.71-.29L46.1,15.06A1,1,0,0,1,45.84,14.1Z" />
      <path d="M24.72,34.48a1,1,0,0,0-1.41,0L15.84,42c-9-2.56-15.56,8.5-9,15.19s17.79,0,15.19-9l7.47-7.47a1,1,0,0,0,0-1.41Zm-7.23,15.6-.86,3.21a1,1,0,0,1-.71.71l-3.21.86a1,1,0,0,1-1-.26L9.4,52.25a1,1,0,0,1-.26-1L10,48.08a1,1,0,0,1,.71-.71l3.21-.86a1,1,0,0,1,1,.26l2.35,2.35A1,1,0,0,1,17.49,50.08Z" />
    </svg>
  );
};

export default ConfigurationIcon;

